<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
  <button class="ppp" onclick="getAll()">获取当前全部数据</button>
  <div><span>名字：</span><input class="name" type="text" style="widtn:100px"></div>
  <div><span>年龄：</span><input class="age" type="text" style="widtn:100px"></div>
  <button class="sub" onclick="add()">增加数据</button>
  <button class="sub" onclick="del()">删除数据</button>
  <button class="sub" onclick="searchOne()">根据名字查询年龄</button>
  <button class="sub" onclick="update()">根据名字更改年龄</button>
  <p>测试提交对象数据</p>
  <textarea class="textAAA"></textarea>
  <button onclick="subJson()">写入数据到数据库</button>
  <button onclick="testJson()">插入Json</button>
  <button onclick="testGetJson()">取Json</button>
</body>
<script>
  let baseDate = {
    "title": "单项选择",
    "moduleName": "radioUnit",
    "id": 0,
    "props": {
      "name": "单选选择",
      "content": "我是内容",
      "setItem": {
        "checked": 0,
        "item": [
          {"name": 1, "value": "单项选择一"},
          {"name": 2, "value": "单项选择二"},
          {"name": 3, "value": "单项选择三"}
        ]
      },
      "isRequired": true
    }
}
  // 测试传baseDate到数据库
  function testJson() {
    // 先将Json对转换成Json字符串
    let aadata = JSON.stringify(baseDate)
    $.ajax({
      type: 'post',
      url:'http://127.0.0.1:3000/subJson',
      data: {data: aadata},
      success: function(res){
        console.log(res.msg)
      }
    })
  }
  // 测试获取数据库的Json数据
  function testGetJson() {
    // 根据id获取，id需要对应数据库的json数据的id
    let mid = 17
    $.ajax({
      type: 'post',
      url:'http://127.0.0.1:3000/GetJson',
      data: {id: mid},
      success: function(res){
        console.log(res)
      }
    })
  }

  // 提交textarea数据
  function subJson(){
    let data = $('.textAAA').val()
    
    $.ajax({
      type: 'post',
      url:'http://127.0.0.1:3000/subJson',
      data: {data:data},
      success: function(res){
        console.log(res.msg)
      }
    })
  }



  // 获取所有数据
  function getAll() {
    // for(let i=0;i<10000;i++){
      // setTimeout(()=>{
        $.ajax({
          type: 'get',
          url: 'http://127.0.0.1:3000/getAll',
          success: function(data) {
            console.log(data)
            // console.log(i)
          }
        })
      // },20)  
    // }
  }

  // 增加数据 
  function add() {
    let name = $('.name').val()
    let age = $('.age').val()
    if(name && age) {
      $.ajax({
        type: 'post',
        data: {name: name, age: age},
        url: 'http://127.0.0.1:3000/add',
        success: function(res) {
          console.log(res.msg)
        }
      })
    }
  }

  // function add() {
  //   let name = $('.name').val()
  //   let age = $('.age').val()
  //   for(let i=0;i<1000;i++){
  //     $.ajax({
  //       type: 'post',
  //       data: {name: name, age: age},
  //       url: 'http://127.0.0.1:3000/add',
  //       success: function(res) {
  //         console.log(i)
  //       }
  //     })
  //   }
  // }
  // 删除数据
  function del(){
    let name = $('.name').val()
    if(name) {
      $.ajax({
        type: 'post',
        data: `name=${name}`,
        url: 'http://127.0.0.1:3000/del',
        success: function(res) {
          alert(res.msg)
        }
      })
    }
  }

  // function del(){
  //   let name = $('.name').val()
  //   for(let i=0;i<500;i++){
  //     $.ajax({
  //       type: 'post',
  //       data: `name=${name}`,
  //       url: 'http://127.0.0.1:3000/del',
  //       success: function(res) {
  //         console.log(i)
  //         console.log(res.msg)
  //       }
  //     })
  //   }
  // }


  // 查询单一数据
  function searchOne(){
    let name = $('.name').val()
    if(name) {
      $.ajax({
        type: 'post',
        data: `name=${name}`,
        url: 'http://127.0.0.1:3000/searchOne',
        success: function(res) {
          console.log(res)
        }
      })
    }
  }
  // 根据name修改年龄
  function update(){
    let name = $('.name').val()
    let age = $('.age').val()
    if(name && age) {
      $.ajax({
        type: 'post',
        data: `name=${name}&age=${age}`,
        url: 'http://127.0.0.1:3000/update',
        success: function(res) {
          alert(res.msg)
        }
      })
    }
  }
</script>
</html>